.reader-avatar {
	margin: 0 auto;
	max-height: 105px;

	&.is-compact {
		max-height: 34px;
	}
}

.reader-avatar {
	&.has-site-and-author-icon {
		.site-icon {
			height: 96px;
			width: 96px;

			.gridicon {
				height: 96px;
				width: 96px;
			}
		}

		.gravatar {
			border: 2px solid var( --color-border-inverted );
			height: 80px;
			position: relative;
				left: 30px;
				top: -75px;
			width: 80px;
			background-color: var( --color-surface );
		}
	}

	&.is-compact {
		&.has-gravatar {
			min-width: 32px;
			min-height: 32px;
		}

		&.has-site-and-author-icon {
			.site-icon {
				height: 32px;
				width: 32px;

				.gridicon {
					height: 32px;
					width: 32px;
				}
			}

			.gravatar {
				height: 24px;
				left: 12px;
				top: -22px;
				width: 24px;
			}
		}
	}
}
